﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Forum.Master" AutoEventWireup="true" CodeBehind="HienThiPost.aspx.cs" Inherits="Client.WebForm11" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript" src="Scripts/json2.js"></script>
<script type="text/javascript" src="Scripts/json_parse.js"></script>
<script type="text/javascript" src="Scripts/json_parse_state.js"></script>
<script type="text/javascript" src="Scripts/cycle.js"></script>
<script type="text/javascript" src="Scripts/1.js"></script> 
<script src="http://code.jquery.com/jquery-latest.js"></script>
 <script src="Scripts/jquery-1.8.2.js"></script>
    <script src="Scripts/jquery-ui-1.9.1.custom.js"></script>
    <link rel="stylesheet" href="Styles/jquery-ui-1.9.2.custom.css" />
    <link rel="stylesheet" href="Styles/ThuNhoAnh.css"/>
    <link rel="stylesheet" href="Styles/jquery-ui.css" />

    <link rel="stylesheet" media="screen" href="lib/datatables/css/cleanslate.css" />
     <script type="text/javascript" src="lib/datatables/js/jquery.dataTables.js"></script> 
<script>
    $(function () { 
        var ID=<%=ReturnID() %>;
        var name=<%=ReturnName() %>;
        var Ava=<%=ReturnAvatar() %>;
       $(function () {
            ID=<%=ReturnID() %>;
            name=<%=ReturnName() %>;
            Ava=<%=ReturnAvatar() %>;
            
            if(name=="")
                $("#Control").hide();
            else
                $("#Control").show();
        });
        $("#HuyXemThu").hide();
        $("#BanNhap").hide();
        var URL = 'http://localhost:18796/api/values/';
        var b = setInterval(function () {
            jQuery.support.cors = true;
            $.ajax({
                url: URL + '?ID='+ID+'&cmnt=',
                type: 'GET',
                datatype: 'json',
                success: function (data) {
                       $("#Comment").empty();
                        for(var i=0;i<data.length;i++)
                       { 
                           $("#Comment").append(
                            "<tr><td>"+data[i].Code+"</td>"+ 
                            "<td ><div class='divImg'><img src='"+data[i].Avatar+"' width='45px'/> "+data[i].NguoiDang +" :</div>"+
                            "<p style='color:blue;margin-left:30px;font-size:10px'>"+data[i].NgayDang+"</p><Br>"+
                            "<div>" +data[i].NoiDung +"</div></td></tr>>"
                            );
                        }
                        $('#example').dataTable();
                },
                error: function () {

                }
            });
        }, 120000);
        $(function () {                    
            jQuery.support.cors = true;
            $.ajax({
                url: URL + '?ID='+ID+'&cmnt=',
                type: 'GET',
                datatype: 'json',
                success: function (data) {
                        $("#Comment").empty();
                        for(var i=0;i<data.length;i++)
                       { 
                           $("#Comment").append(
                            "<tr><td>"+data[i].Code+"</td>"+ 
                            "<td  ><div class='divImg'><img src='"+data[i].Avatar+"' width='45px'/> "+data[i].NguoiDang +" :</div>"+
                            "<p style='color:blue;margin-left:30px;font-size:10px'>"+data[i].NgayDang+"</p><Br>"+
                            "<div>" +data[i].NoiDung +"</div></td></tr>>"
                            );
                        }
                        $('#example').dataTable();
                        
                },
                error: function () {

                }
            });
        });
        $(function () {                    
            jQuery.support.cors = true;
            $.ajax({
                url: URL + '?ID='+ID,
                type: 'GET',
                datatype: 'json',
                success: function (data) {
                        $("#XemThuNoiDung").append(

                        "<div class='content_section'>" +
                        "<h2>"+data.TuaDe + "</h2>" +   
                        "<p style='color:blue;margin-left:30px;font-size:10px'>Ngày Đăng :"+data.NgayDang+"</p>"+   
                        "<p style='color:blue;margin-left:30px;font-size:10px'>Tác Giả :"+data.NguoiDang+"</p><Br>"+          
                  	    data.NoiDung+                      
            	        "</div>"
                        );
                        
                },
                error: function () {

                }
            });
        });
            $("#Br")
            .button()
            .click(function () {
                document.getElementById("TextArea1").value = document.getElementById("TextArea1").value +"<Br>";
            });
             $("#quote")
            .button()
            .click(function () {
                $("#TextQuote").dialog("open");
            });
            $("#createlink")
            .button()
            .click(function () {
                $("#linkurl").dialog("open");
            });
            $("#insertimage")
            .button()
            .click(function () {
                $("#imgurl").dialog("open");
            });
            $.fx.speeds._default = 1000;
            $("#linkurl").dialog({
                autoOpen: false,
                show: "blind",
                hide: "explode",
                buttons: {
                    Add: function () {
                        var url = $("#textlinkurl").val();
                        var mota = $("#text1linkurl").val();
                        document.getElementById("TextArea1").value = document.getElementById("TextArea1").value +
                        "<a href='" + url + "'>" + mota + "</a>";
                        $(this).dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });
            $("#imgurl").dialog({
                autoOpen: false,
                show: "blind",
                hide: "explode",
                buttons: {
                    Add: function () {
                        var url = $("#textimgurl").val();
                        document.getElementById("TextArea1").value = document.getElementById("TextArea1").value +
                        "<img src='" + url + "'></img>";
                        $(this).dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });
            $("#TextQuote").dialog({
                autoOpen: false,
                show: "blind",
                hide: "explode",
                buttons: {
                    Add: function () {
                        var url = $("#ContentQuote").val();
                        document.getElementById("TextArea1").value = document.getElementById("TextArea1").value +
                        '<blockquote>" ' + url + ' "</blockquote>';
                        $(this).dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });
            $("#bold")
            .button()
            .click(function () {
                document.getElementById("TextArea1").value = document.getElementById("TextArea1").value + "<b></b>";
            });
            $("#italic")
            .button()
            .click(function () {
                document.getElementById("TextArea1").value = document.getElementById("TextArea1").value + "<i></i>";
            });
            $("#underline")
            .button()
            .click(function () {
                document.getElementById("TextArea1").value = document.getElementById("TextArea1").value + "<u></u>";
            });
            $("#removeformat")
            .button()
            .click(function () {
                var a = document.getElementById("TextArea1").value;
                a = a.replace('<b>', '');
                a = a.replace('</b>', '');
                a = a.replace('<u>', '');
                a = a.replace('</u>', '');
                a = a.replace('<i>', '');
                a = a.replace('</i>', '');
                document.getElementById("TextArea1").value = a;
            });
            $("#DangComment")
            .button()
            .click(function () {
                jQuery.support.cors = true;
                
                var temp=document.getElementById("TextArea1").value;
                temp=temp.replace("http://","");
                $.ajax({
                    url: URL + '?ID='+ID+'&NguoiDang='+name+'&NoiDung='+document.getElementById("TextArea1").value+'&Avatar='+Ava,
                    type: 'GET',
                    datatype: 'json',
                    success: function (data) {                         
                        if(data==true)
                            {
                                alert("Them Thành Công !");
                                document.getElementById("TextArea1").value="";
                                window.location.reload();
                            }
                            else alert("Thử Lại !");
                    },
                    error: function () {
                        alert("Loi He Thong !");
                    }
                });
            });
             $("#XemThu")
            .button()
            .click(function () {
                $("#BangComment").hide();
                $("#HuyXemThu").show();
                var a = document.getElementById("TextArea1").value;
                $("#BanNhap").show();
                $("#BanNhap").append(a);
                $("#XemThu").hide();
            });
             $("#HuyXemThu")
            .button()
            .click(function () {
                $("#BanNhap").empty();
                $("#BanNhap").hide();
                $("#BangComment").show();
                $("#XemThu").show();
                $("#HuyXemThu").hide();
            });
    });
</script>
    <style type="text/css">

        #TextArea1
        {
            width: 532px;
            height: 84px;
        }
        </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div id="linkurl" title="Thêm Link">
     <fieldset class="ui-helper-reset">
            <label for="tab_title">URL Link</label>
            <input type="text" name="tab_title" id="textlinkurl" value="" class="ui-widget-content ui-corner-all" />   
            <br />
            <label for="tab_title">Mô Tả   </label>
            <input type="text" name="tab_title" id="text1linkurl" value="" class="ui-widget-content ui-corner-all" />          
        </fieldset>
    </div>
    <div id="imgurl" title="Thêm Hình">
     <fieldset class="ui-helper-reset">
            <label for="tab_title">URL Image</label>
            <input type="text" name="tab_title" id="textimgurl" value="" class="ui-widget-content ui-corner-all" />         
        </fieldset>
    </div>
    <div id="TextQuote" title="Thêm Hình">
     <fieldset class="ui-helper-reset">
            <label for="tab_title">Trích Dẫn</label>
            <input type="text" name="tab_title" id="ContentQuote" value="" class="ui-widget-content ui-corner-all" />         
        </fieldset>
    </div>
<div id="XemThuNoiDung">
   
    
</div>
 <table class="display" id="example"> 
                                <thead> 
                                    <tr> 
                                        <th>stt</th> 
                                        <th>Comment</th> 
                                    </tr> 
                                </thead> 
                                <tbody id="Comment"> 
                                  
                                  
                                </tbody> 
                            </table> 
<div id='BanNhap'>
    
        </div>
<div id='Control' style='padding-top:10px'>
 
            <table id='BangComment' style='width: 100%;' border='1' cellpadding='1' cellspacing='1'>
                <tr>
                    <td bgcolor='#CCCCCC' width='12%' align='center'>
                         <button type="button" id='removeformat'> <img src='imgDangBai/removeformat.gif' /></button>
                    </td>
                    <td bgcolor='#CCCCCC' width='12%' align='center'>
                        <button type='button' id='bold'> <img src='imgDangBai/bold.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='12%' align='center'>
                        <button type='button' id='italic'> <img src='imgDangBai/italic.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='12%' align='center'>
                        <button type='button' id='underline'> <img src='imgDangBai/underline.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='13%' align='center'>
                        <button type='button' id='createlink'> <img src='imgDangBai/createlink.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='13%' align='center'>
                        <button type='button' id='insertimage'> <img src='imgDangBai/insertimage.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='13%' align='center'>
                        <button type='button' id='quote'> <img src='imgDangBai/quote.gif' /></button></td>
                    <td bgcolor='#CCCCCC' width='13%' align='center'>
                        <input id='Br' type='button' value='<Br>' /></td>
                </tr>
                <tr>
                    <td colspan='8'>
                        <textarea id='TextArea1' name='S1' cols='20'></textarea>
                    </td>
                </tr>
            </table>
            <table style='width: 100%;' border='1' cellpadding='1' cellspacing='1'>
                <tr>
                    <td align='Center' width='45%'>
                        <input id='XemThu' type='button' value='Xem Thử' />
                        <input id='HuyXemThu' type='button' value='Hủy Xem Thử' /></td>
                    <td align='Center' width='55%'>
                        <input id='DangComment' type='button' value='Đăng Comment' /></td>
                
                </tr>
            </table>    

    </div>
</asp:Content>
